<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<style type="text/css">
	.search{width: 900px;margin: auto;margin-top: 250px;}
	.search_left{border:1px solid #ffffff; border-radius:2px; width: 148px;float: left;}
	.search_left_line{width:128px;height:18px;padding:10px;color: #5D5D5D;font-size:18px;font-weight: bold;}
	.search_left_lineMenu{width:148px;}
	.search_left_region{width:128px;height:18px;padding:10px;color: #5D5D5D;font-size:18px;font-weight: bold;}
	.search_left_regionMenu{width:148px;}
	.submenu{width: 148px;}
	.search_right{width: 750px;float: left;margin-top: 10px;}
	.search_right_univtype{background-color:#212121;border-top: 1px solid lightgray;border-left: 1px solid lightgray;border-right: 1px solid lightgray;border-bottom: 1px solid lightgray;width:210px;height:30px;margin-left: 20px;float: left;}
	.search_right_order{
		width: 120px;
		height: 32px;
		margin-left: 398px;
		float: left;
	}
	#orderByColumn{
		border: 1px solid lightgray;
		width:120px;
		height:30px;
		color: #5D5D5D;
		font-size: 12px;
		font-weight: bold;
	}
	.search_right_major{width: 728px;height: 180px;margin-top:10px;margin-left: 20px;border: 1px solid #BDBDBD;float: left;}
	.search_right_major_logo{width: 100px;height: 200px;margin:10px;float: left;}
	.search_right_major_name{width: 598px;height: 50px;margin-top: 10px;float: left;}
	.search_right_major_scoreAvg{width:150px;height: 30px;float: left;}
	.search_right_major_scoreAvg_text{width:55px;height: 23px;margin-top:7px;color: #5D5D5D;font-weight:bold;float: left;}
	.search_right_major_reviewCount{width:55px;height: 13px;margin-top:8px;color: #5D5D5D;font-size:13px;float: left;text-align: right;}
	.linkto{width: 338px;height: 15px;margin-top:8px;float: left;}
	.linkto_review{width: 55px;height: 15px;margin-left:200px;float: left;}
	.vertical_line{width: 1px;height: 15px;background-color: gray;margin-left:5px;margin-right:10px;float: left;}
	.linkto_examinfo{width: 55px;height: 15px;float: left;}
	.line{width: 598px;height: 1px;background-color: lightgray;margin-top:10px;float: left;}
	.scores{width:588px;height:40px;color: #5D5D5D;font-size:12px;margin-top: 15px;margin-left:5px;float: left;}
	.scores_top{width:588px;height:20px;float: left;}
	.search_right_major_jobAvg_text{width:60px;height:12px;margin-left:5px;float: left;}
	.search_right_major_jobAvg{width:90px;height:4px;margin-top:3px;margin-left:5px;float: left;}
	.search_right_major_professorAvg_text{width:90px;height:12px;margin-left:20px;float: left;}
	.search_right_major_professorAvg{width:90px;height:4px;margin-top:3px;margin-left:5px;float: left;}
	.search_right_major_facilityAvg_text{width:100px;height:12px;margin-left:20px;float: left;}
	.search_right_major_facilityAvg{width:90px;height:4px;margin-top:3px;margin-left:5px;margin-right:3px;float: left;}
	.scores_bottom{width:588px;height:20px;margin-top:10px;float: left;}
	.search_right_major_scholarshipAvg_text{width:60px;height:12px;margin-left:5px;float: left;}
	.search_right_major_scholarshipAvg{width:90px;height:4px;margin-top:3px;margin-left:5px;float: left;}
	.search_right_major_awarenessAvg_text{width:90px;height:12px;margin-left:20px;float: left;}
	.search_right_major_awarenessAvg{width:90px;height:4px;margin-top:3px;margin-left:5px;float: left;}
	.search_right_major_genderAvg_text{width:100px;height:12px;margin-left:20px;float: left;}
	.search_right_major_genderAvg{width:90px;height:4px;margin-top:3px;margin-left:5px;float: left;}
	.search_right_page{margin-bottom: 30px;text-align: center;}
</style>
<script>
	$(function() {
		$( ".menu" ).menu();
		
		$('#orderByColumn').change(function(){
			location.href="major.do?command=${param.command}&&column="+$(this).val()+"&&search=${param.search}&&line_no=${param.line_no}&&subline_no=${param.subline_no}&&region_no=${param.region_no}&&univtype_no=${param.univtype_no}";
		});
		
		$('#orderByColumn>option').mouseover(function(){
			$(this).css('background', 'red'); 
		});
	});

	function checkType(type){
		if(type==1){
			clearType();
			$('.search_right_univtype_4').css({"background-color":"white","border-bottom":"3px solid #F15F5F","width":"70px","height":"20px","padding-top":"7px","float":"left","text-align":"center"});
			$('.search_right_univtype_4>a').css('color','#5D5D5D');
		}else if(type==2){
			clearType();
			$('.search_right_univtype_2').css({"background-color":"white","border-bottom":"3px solid #F15F5F","width":"70px","height":"20px","padding-top":"7px","float":"left","text-align":"center"});
			$('.search_right_univtype_2>a').css('color','#5D5D5D');
		}else{
			clearType();
			$('.search_right_univtype_all').css({"background-color":"white","border-bottom":"3px solid #F15F5F","width":"70px","height":"20px","padding-top":"7px","float":"left","text-align":"center"});
			$('.search_right_univtype_all>a').css('color','#5D5D5D');
		}
	}
	
	function clearType() {
		$('.search_right_univtype_all').css({"background-color":"#212121","width":"70px","height":"23px","padding-top":"7px","float":"left","text-align":"center"});
		$('.search_right_univtype_all>a').css('color','white');
		$('.search_right_univtype_4').css({"background-color":"#212121","width":"70px","height":"23px","padding-top":"7px","float":"left","text-align":"center"});
		$('.search_right_univtype_4>a').css('color','white');
		$('.search_right_univtype_2').css({"background-color":"#212121","width":"70px","height":"23px","padding-top":"7px","float":"left","text-align":"center"});
		$('.search_right_univtype_2>a').css('color','white');
	}
</script>
</head>
<body onload="checkType(${param.univtype_no})">
<c:import url="../index/header.jsp"/><br>
<div class="search">
	<div class="search_left">
		<div class="search_left_line">
			계열검색
		</div>
		<div class="search_left_lineMenu">
			<ul class="menu">
			<c:forEach var="lineReturn" items="${requestScope.lineList}">
			  <li style="font-size: 12px; font-weight: bold; margin-left: 10px; margin-right: 10px;"><a href="major.do?command=searchMajorUnitByLine&&line_no=${lineReturn.line.line_no}" style="text-decoration: none;">${lineReturn.line.line_name}</a>
			    <ul class="submenu">
		    		<c:forEach var="subline" items="${lineReturn.sublineList}">
		      			<li><a href="major.do?command=searchMajorUnitBySubline&&subline_no=${subline.subline_no}">${subline.subline_name}</a></li>
		    		</c:forEach>
			    </ul>
			  </li>
			</c:forEach>
			</ul>
		</div>
		
		<div class="search_left_region">
			지역검색
		</div>
		<div class="search_left_regionMenu">
			<ul class="menu">
			<c:forEach var="region" items="${requestScope.regionList}">
			  <li style="font-size: 12px; font-weight: bold; margin-left: 10px; margin-right: 10px;">
			  	<a href="major.do?command=searchMajorUnitByRegion&&region_no=${region.region_no}" style="text-decoration: none;">${region.region_name}</a>
			  </li>
			</c:forEach>
			</ul>
		</div>
	</div>
	
	<div class="search_right">
		<div class="search_right_univtype">
			<div class="search_right_univtype_all">
				<a href="major.do?command=${param.command}&&column=${param.column}&&search=${param.search}&&line_no=${param.line_no}&&subline_no=${param.subline_no}&&region_no=${param.region_no}&&univtype_no=0" style="text-decoration: none; font-size: 15px; font-weight: bold;">전체</a>
			</div>
			<div class="search_right_univtype_4">
				<a href="major.do?command=${param.command}&&column=${param.column}&&search=${param.search}&&line_no=${param.line_no}&&subline_no=${param.subline_no}&&region_no=${param.region_no}&&univtype_no=1" style="text-decoration: none; font-size: 15px; font-weight: bold;">4년제</a>
			</div>
			<div class="search_right_univtype_2">
				<a href="major.do?command=${param.command}&&column=${param.column}&&search=${param.search}&&line_no=${param.line_no}&&subline_no=${param.subline_no}&&region_no=${param.region_no}&&univtype_no=2" style="text-decoration: none; font-size: 15px; font-weight: bold;">2년제</a>
			</div>
		</div>
		<div class="search_right_order">
			<select id="orderByColumn">
				<option value="review_score">총점순으로</option>
				<option value="review_job"<c:if test="${param.column=='review_job'}"> selected="selected"</c:if>>취업순으로</option>
				<option value="review_professor"<c:if test="${param.column=='review_professor'}"> selected="selected"</c:if>>교수진순으로</option>
				<option value="review_facility"<c:if test="${param.column=='review_facility'}"> selected="selected"</c:if>>시설순으로</option>
				<option value="review_scholarship"<c:if test="${param.column=='review_scholarship'}"> selected="selected"</c:if>>장학금순으로</option>
				<option value="review_awareness"<c:if test="${param.column=='review_awareness'}"> selected="selected"</c:if>>인지도순으로</option>
			</select>
		</div>
		
		<c:forEach var="unitReturn" items="${requestScope.unitList.majorunitList}">
		<div class="search_right_major">
			<div class="search_right_major_logo">
				<img alt="logo" src="../img/logo/test.png<%-- ${unitReturn.majorunit_logo} --%>">
			</div>
			<div class="search_right_major_name">
				<a href="review.do?command=review&&majorunit_no=${unitReturn.majorunit_no}" style="text-decoration: none;color: #5D5D5D;font-weight: bold;font-size: 20px;">${unitReturn.majorunit_name}</a>
			</div>
			<div class="search_right_major_scoreAvg">
				<c:forEach begin="1" end="${unitReturn.scoreAvg}"><img alt="" src="../img/view/review/star_selected.png" width="30px" height="30px"></c:forEach><c:forEach begin="1" end="${5-unitReturn.scoreAvg}"><img alt="" src="../img/view/review/star_deselected.png" width="30px" height="30px"></c:forEach>
			</div>
			<div class="search_right_major_scoreAvg_text">
				&nbsp;${unitReturn.scoreAvg}점
			</div>
			<div class="search_right_major_reviewCount">
				리뷰 <font style="color: orange;">${unitReturn.reviewCount}</font>건
			</div>
			<div class="linkto">
				<div class="linkto_review">
					<a href="review.do?command=review&&majorunit_no=${unitReturn.majorunit_no}" style="text-decoration: none;color: #5D5D5D;font-size: 13px;">학과리뷰</a>
				</div>
				<div class="vertical_line"></div>
				<div class="linkto_examinfo">
					<a href="review.do?command=exam&&page=1&&majorunit_no=${unitReturn.majorunit_no}" style="text-decoration: none;color: #5D5D5D;font-size: 13px;">입시리뷰</a>
				</div>
			</div>
			<div class="line"></div>
			
			<div class="scores">
				<div class="scores_top">
					<div class="search_right_major_jobAvg_text">
						취업 전망
					</div>
					<div class="search_right_major_jobAvg">
						<c:forEach begin="1" end="${unitReturn.jobAvg}"><label style="display: inline-block; background-color: #F15F5F; padding: 3px 8px; border-right: 1px solid #FFFFFF"></label></c:forEach><c:forEach begin="1" end="${5-unitReturn.jobAvg}"><label style="display: inline-block; background-color: #ddd; padding: 3px 8px; border-right: 1px solid #FFFFFF"></label></c:forEach>
					</div>
					<div class="search_right_major_professorAvg_text">
						교수진 및 강의
					</div>
					<div class="search_right_major_professorAvg">
						<c:forEach begin="1" end="${unitReturn.professorAvg}"><label style="display: inline-block; background-color: #FF9436; padding: 3px 8px; border-right: 1px solid #FFFFFF"></label></c:forEach><c:forEach begin="1" end="${5-unitReturn.professorAvg}"><label style="display: inline-block; background-color: #ddd; padding: 3px 8px; border-right: 1px solid #FFFFFF"></label></c:forEach>
					</div>
					<div class="search_right_major_facilityAvg_text">
						학교지원 및 시설
					</div>
					<div class="search_right_major_facilityAvg">
						<c:forEach begin="1" end="${unitReturn.facilityAvg}"><label style="display: inline-block; background-color: #FFCD12; padding: 3px 8px; border-right: 1px solid #FFFFFF"></label></c:forEach><c:forEach begin="1" end="${5-unitReturn.facilityAvg}"><label style="display: inline-block; background-color: #ddd; padding: 3px 8px; border-right: 1px solid #FFFFFF"></label></c:forEach>
					</div>
				</div>
				<div class="scores_bottom">
					<div class="search_right_major_scholarshipAvg_text">
						장학금
					</div>
					<div class="search_right_major_scholarshipAvg">
						<c:forEach begin="1" end="${unitReturn.scholarshipAvg}"><label style="display: inline-block; background-color: #99E000; padding: 3px 8px; border-right: 1px solid #FFFFFF"></label></c:forEach><c:forEach begin="1" end="${5-unitReturn.scholarshipAvg}"><label style="display: inline-block; background-color: #ddd; padding: 3px 8px; border-right: 1px solid #FFFFFF"></label></c:forEach>
					</div>
					<div class="search_right_major_awarenessAvg_text">
						인지도 및 학연
					</div>
					<div class="search_right_major_awarenessAvg">
						<c:forEach begin="1" end="${unitReturn.awarenessAvg}"><label style="display: inline-block; background-color: #5CD1E5; padding: 3px 8px; border-right: 1px solid #FFFFFF"></label></c:forEach><c:forEach begin="1" end="${5-unitReturn.awarenessAvg}"><label style="display: inline-block; background-color: #ddd; padding: 3px 8px; border-right: 1px solid #FFFFFF"></label></c:forEach>
					</div>
					<div class="search_right_major_genderAvg_text">
						남녀비율
					</div>
					<div class="search_right_major_genderAvg">
						<c:set var="genderAvg_round" value="${ unitReturn.genderAvg+((unitReturn.genderAvg%1>0.5)?(1-(unitReturn.genderAvg%1))%1:-(unitReturn.genderAvg%1)) }"/>
						<c:forEach begin="1" end="${genderAvg_round}"><label style="display: inline-block; background-color: #B2EBF4; padding: 3px 3.8px; border-right: 1px solid #FFFFFF"></label></c:forEach><c:forEach begin="1" end="${10-genderAvg_round}"><label style="display: inline-block; background-color: #FFD9FA; padding: 3px 3.8px; border-right: 1px solid #FFFFFF"></label></c:forEach>
					</div>
				</div>
			</div>
		</div><hr style="margin-left: 20px; margin-right: 20px; border: 1px solid white;">
		</c:forEach>
		
		<div class="search_right_page">
			<c:set var="page" value="${requestScope.unitList.pageManager}" />
	
			<c:if test="${page.currGroup==1}"><img alt="" src="../img/button/page_begin.gif"></c:if>
			<c:if test="${page.currGroup!=1}">
				<a href="major.do?command=${param.command}&&page=1&&column=${param.column}&&search=${param.search}&&line_no=${param.line_no}&&subline_no=${param.subline_no}&&region_no=${param.region_no}&&univtype_no=${param.univtype_no}"><img alt="" src="../img/button/page_begin.gif"></a>
			</c:if>
		
			<c:if test="${page.existOfPreviousGroup}">
				<a href="major.do?command=${param.command}&&page=${page.firstPageInCurrGroup-page.pagePerGroup}&&column=${param.column}&&search=${param.search}&&line_no=${param.line_no}&&subline_no=${param.subline_no}&&region_no=${param.region_no}&&univtype_no=${param.univtype_no}">
					<img alt="" src="../img/button/page_prev.gif"></a>
			</c:if>
			<c:if test="${!page.existOfPreviousGroup}"><img alt="" src="../img/button/page_prev.gif"></c:if>
		
			<c:forEach var="pageIndex" begin="${page.firstPageInCurrGroup}"
				end="${page.lastPageInCurrGroup}">
				<c:if test="${pageIndex==page.currPage}">&nbsp;<font color="#ff6d66">${pageIndex}</font>&nbsp;</c:if>
				<c:if test="${pageIndex!=page.currPage}">
					<a href="major.do?command=${param.command}&&page=${pageIndex}&&column=${param.column}&&search=${param.search}&&line_no=${param.line_no}&&subline_no=${param.subline_no}&&region_no=${param.region_no}&&univtype_no=${param.univtype_no}">&nbsp;<font color="#606060">${pageIndex}</font>&nbsp;</a>
				</c:if>
			</c:forEach>
		
			<c:if test="${page.existOfNextGroup}">
				<a href="major.do?command=${param.command}&&page=${page.lastPageInCurrGroup+1}&&column=${param.column}&&search=${param.search}&&line_no=${param.line_no}&&subline_no=${param.subline_no}&&region_no=${param.region_no}&&univtype_no=${param.univtype_no}">
					<img alt="" src="../img/button/page_next.gif"></a>
			</c:if>
			<c:if test="${!page.existOfNextGroup}"><img alt="" src="../img/button/page_next.gif"></c:if>
		
			<c:if test="${page.currGroup==page.totalGroup}"><img alt="" src="../img/button/page_end.gif"></c:if>
			<c:if test="${page.currGroup!=page.totalGroup}">
				<a href="major.do?command=${param.command}&&page=${page.totalPage}&&column=${param.column}&&search=${param.search}&&line_no=${param.line_no}&&subline_no=${param.subline_no}&&region_no=${param.region_no}&&univtype_no=${param.univtype_no}"><img alt="" src="../img/button/page_end.gif"></a>
			</c:if>
		</div>
	</div>
</div>
</body>
</html>